<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title th:text="${task.title}">任务详情</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div th:replace="~{fragments/header :: header}"></div>
    
    <div class="container mt-4">
        <h2 th:text="${task.title}">任务标题</h2>
        
        <div class="card">
            <div class="card-body">
                <h5 class="card-title">任务详情</h5>
                <p class="card-text" th:text="${task.description}">任务描述</p>
                
                <ul class="list-group list-group-flush">
                    <li class="list-group-item">
                        <strong>预算:</strong> 
                        <span th:text="${'¥' + #numbers.formatDecimal(task.budget, 1, 2)}">预算</span>
                    </li>
                    <li class="list-group-item">
                        <strong>状态:</strong>
                        <span th:if="${task.taskStatus == 'open'}" class="badge bg-primary">待承接</span>
                        <span th:if="${task.taskStatus == 'in_progress'}" class="badge bg-warning">进行中</span>
                        <span th:if="${task.taskStatus == 'completed'}" class="badge bg-success">已完成</span>
                        <span th:if="${task.taskStatus == 'closed'}" class="badge bg-secondary">已关闭</span>
                    </li>
                    <li class="list-group-item">
                        <strong>发布时间:</strong> 
                        <span th:text="${#temporals.format(task.publishDate, 'yyyy-MM-dd HH:mm')}">发布时间</span>
                    </li>
                </ul>
                
                <div class="mt-3">
                    <form th:action="@{/freelancer/tasks/{id}/apply(id=${task.taskId})}" method="post" th:if="${!alreadyApplied && !taskTaken}">
                        <button type="submit" class="btn btn-success">申请任务</button>
                    </form>
                    <div th:if="${alreadyApplied}" class="alert alert-info">
                        您已申请此任务
                    </div>
                    <div th:if="${taskTaken && !alreadyApplied}" class="alert alert-warning">
                        此任务已被其他用户承接
                    </div>
                    <a th:href="@{/freelancer/my-applications}" class="btn btn-secondary">返回我的申请</a>
                </div>
            </div>
        </div>
    </div>
    
    <div th:replace="~{fragments/footer :: footer}"></div>
</body>
</html>